//按钮+图标
.el-button {
    height: 40px;
    line-height: 1;
    overflow: hidden;
}

.el-button--primary{
    min-width: 90px;
    &.is-loading{
       border-color:#faa36a;
        cursor: no-drop;
    }
}
.el-button--primary.el-button--medium{
    min-width: 60px;
}

.el-button--default {
    color: @c-666;
    min-width: 90px;
}
.el-button--default:hover,
.el-button--default:focus {
    background: @fff;
    border-color: @primary;
    color: @primary;
}

.el-button.is-disabled,
.el-button.is-disabled:hover,
.el-button.is-disabled:focus {
    color: @c-ccc;
    border-color: @c-ccc;
}

.el-button--primary.is-disabled,
.el-button--primary.is-disabled:hover,
.el-button--primary.is-disabled:focus,
.el-button--primary.is-disabled:active {
    color: #ffffff;
    background-color: @c-ccc;
    border-color: @c-ccc;
}
.el-button + .el-button {
    margin-left: 20px;
}
// 小按钮
.el-button--medium {
    padding: 10px 17px;
}

.el-button--text {
    color: @info;
}
.el-button--text:hover,
.el-button--text:focus {
    color: #4560e5;
}

.el-button--text.is-disabled,
.el-button--text.is-disabled:hover,
.el-button--text.is-disabled:focus {
    border-color: transparent;
}


//el-message-box
.el-message-box {
    padding-bottom: 30px;
    border: none;
    .el-message-box__header {
        border-radius: 4px 4px 0 0;
        height: 44px;
        line-height: 44px;
        font-size: 12px;
        text-align: left;
        padding: 0 28px;
        color: #333;
        background: #f8f8f8;
        .el-message-box__close.el-icon-close {
            font-size: 20px;
        }
        .el-message-box__title {
            font-size: 12px;
            line-height: 42px;
        }
        .el-message-box__headerbtn {
            top: 0;
            right: 15px;
        }
    }
    .el-message-box__content {
        text-align: center;
        // padding: 36px 0 44px 0;
        padding: 36px 0 47px 0;
        .el-message-box__status {
            position: relative;
            // @include inline-block(none);
            -webkit-transform: translateY(0%);
            transform: translateY(0%);
            vertical-align: middle;
        }
        .el-message-box__message {
            // @include inline-block(none);
            vertical-align: middle;
        }
        .el-message-box__status + .el-message-box__message {
            padding-left: 0;
        }
    }
    .el-message-box__btns {
        text-align: center;
        padding-top: 2px;
        
        display: flex;
        flex-direction: row-reverse;
        justify-content: center;
        
        .el-button {
            min-width: 90px;
            border-radius: 2px;
        }
        button:nth-child(2) {
            // margin-left: 20px;
            margin-right: 20px;
        }
        .el-button--small.el-button--primary {
            color: @fff;
        }
    }
}

//弹框
.el-dialog {
    border-radius: 4px;
    .my-cont {
        text-align: center;
        padding: 15px 0 7px 0;
    }
    .el-dialog__footer {
        padding-bottom: 30px;
    }
}
.el-dialog__header {
    border-radius: 4px 4px 0 0;
    height: 42px;
    line-height: 42px;
    font-size: 12px;
    text-align: left;
    padding: 0 28px;
    color: #333;
    background: @f8;
    .el-dialog__title {
        font-size: 12px;
    }
    .el-dialog__headerbtn {
        top: 0;
        right: 15px;
    }
    .el-dialog__close {
        font-size: 20px;
    }
}

// 分页
.el-pagination {
    font-weight: 500;
    .btn-prev span:not([class*='suffix']):before {
        font-family: element-icons !important;
        content: '\e600';
    }
    .btn-next span:not([class*='suffix']):after {
        font-family: element-icons !important;
        content: '\e604';
    }
    .btn-prev span:not([class*='suffix']),
    .btn-next span:not([class*='suffix']) {
        width: 70px;
        // border: 1px solid @e8;
        line-height: 30px;
    }
    &.is-background .el-pager li:not(.disabled).active {
        border: 1px solid @primary;
    }
    &.is-background .el-pager li {
        border: 1px solid @e8;
        color: @c-333;
    }
    &.is-background .btn-prev, 
    &.is-background .btn-next {
        min-width: 40px;
        border: 1px solid #e8e8e8;
        line-height: 40px;
    }
    .el-pagination__editor.el-input{
        width: 40px;
    }
    .btn-submit{
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 16px;
        color:#606266;
        cursor: pointer;
            border-radius: 2px;
        background-color: #f4f4f5;
        border: 1px solid #e8e8e8;
    }
}
.el-link{
   &.el-link--info{
        text-decoration: none;
   }
    margin-right: 10px;
    text-decoration: underline;
    line-height: 14px;
    &.is-underline:hover:after{
      border-bottom:none;   
    }
}


//  el-form-item /el-input
.el-form-item {
    margin-bottom: 18px;
    .el-input {
        line-height: 40px;
    }
}
.el-textarea__inner {
    border: 1px solid @e8;
}
.el-form-item__content {
    line-height: 40px !important;
    font-size: @fontS12;
    color: @c-333;
}
.el-form-item__label {
    font-size: @fontS12;
    line-height: 34px;
    color: @c-666;
    padding-right: 16px;
}

// 选择框
.el-checkbox-group {
    max-width: 1000px;
}
.el-checkbox__label {
    font-size: @fontS12;
    font-weight: normal;
    line-height: 34px;
    color: @c-999;
}
.el-checkbox__inner {
    width: 16px;
    height: 16px;
    border: 1px solid @c-ccc;
    &::after {
        left: 5px;
        height: 8px;
        content: '';
    }
}
// 下拉框
.el-select-dropdown {
    color: @c-666;
    font-size: @fontS12;
    line-height: 34px;
    .el-select-dropdown__item {
        &.hover,
        &:hover {
            color: @primary;
        }
    }
    .el-select-dropdown__list {
        padding: 0;
    }
    &.is-multiple {
        .el-select-dropdown__item {
            &.selected.hover {
            }
        }
    }
}
.el-select {
    .el-tag {
        background-color: @f8;
        color: @c-333;
        max-width: 80px;
        overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
    }
}

// 下拉菜单三角形样式
.el-popper[x-placement^="top"],
.el-popper[x-placement^="bottom"] {
    .popper__arrow {
        display: none;
        &::after {
            display: none;
        }
    }
}


// 分页
.el-pagination.is-background .el-pager li:not(.disabled).active {
    background-color: @primary;
}

// 导航栏
.el-tabs__header {
    margin-bottom: 0;
    .el-tabs__item {
        height: 40px;
        line-height: 40px;
        border: 0;
        &:focus {
            &.is-focus.is-active:not(:active) {
                box-shadow: none;
            }
        }
    }
    .el-tabs__nav-next{
            box-shadow: -3px -1px 4px #f8f8f8;
    }
    .el-tabs__nav-prev {
         box-shadow: 3px -1px 4px #f8f8f8;
    }
    .el-tabs__nav-next,
    .el-tabs__nav-prev {
        line-height: 40px;
        font-size: 18px;
        width: 90px;
        text-align: center;
        color: @c-ccc;
        background: @fff;
        z-index: 1000;
       &.is-disabled{
           /* color:@c-ccc;
           cursor: no-drop; */
       }
    }
    .el-tabs__nav {
        border: 0;
    }
}
.el-tabs__item.is-bottom:nth-child(2){}
.el-tabs__nav-wrap.is-scrollable {
    padding: 0 90px;
}
.el-tabs--card > .el-tabs__header {
    border: 0;
    .el-tabs__item,
    .el-tabs__nav {
        border: 0;
        &.is-active {
            border-radius: @box-radius @box-radius 0 0;
            background: @f8;
            color: @c-666;
        }
        .el-icon-close {
            top: 10px;
            right: 8px;
            position: absolute;
        }
    }
}
.el-card.is-hover-shadow:hover,
.el-card.is-hover-shadow:focus {
    box-shadow: 0px 2px 13px 0px rgba(7, 0, 2, 0.07);
}
.el-tabs__nav-wrap::after {
    width: 270px;
    height: 1px;
}
.el-tabs__active-bar {
    height: 3px;
}

.el-upload {
    float: left;
    &-list {
        float: left;
        &__item {
            float: left;
            margin-top: 0;
            width: auto;
            &:first-child {
                margin-top: 0;
            }
        }
    }
}

// 表单
.el-table th, 
.el-table td{
    padding: 10px 0;
}
.el-table.el-table--border.el-table--enable-row-transition{
    td {
        border-right: 1px solid #e8e8e8;
    }
}
.el-table__fixed::before, .el-table__fixed-right::before {
    height:0;
}
.el-table {
    &::before {
        height: 0;
    }
    .el-table-column--selection {
        .cell {
            padding: 0;
            .el-checkbox {
                margin-left: -10px;
            }
        }
    }
    .cell {
        font-size: @fontS12;
        line-height: 24px;
        color: @c-333;
    }
    th {
        background: @f8;
        .cell {
            color: @c-666;
            font-size:@fontS12; 
        }
    }
    &--border th,
    &--border td {
        border-right: 1px solid #e8e8e8;
    }
    &--striped {
        .el-table__body {
            tr {
                &.el-table__row--striped {
                    background: @f8;
                }
                &.el-table__row--striped:hover{
                    background: @f8!important;
                }
            }
        }
    }
    &--enable-row-hover {
        .el-table__body {
            tr {
                &:hover {
                    background: @f8;
                }
            }
        }
    }
    .sort-caret {
        &.ascending {
            border-bottom-color: @c-ccc;
            &:hover {
                border-bottom-color: @primary;
            }
        }
        &.descending {
            border-top-color: @c-ccc;
            &:hover {
                border-top-color: @primary;
            }
        }
    }
}

// 输入框
.el-input__inner {
    border-color: @e8;
    color: @c-333;
}

// 侧边栏
// .el-menu {
//     &-item {
//         line-height: 44px;
//         height: 44px;
//         font-size: @fontS14;
//         color: @c-999;
//         &.is-active {
//             color: @c-333;
//         }
//     }
// }
// .el-menu--collapse {
//     width: 70px;
// }
// .el-submenu [class^='el-icon-'],
// .el-menu--collapse > .el-menu-item [class^='el-icon-'],
// .el-menu--collapse > .el-submenu > .el-submenu__title [class^='el-icon-'] {
//     width: 20px;
//     font-size: 20px;
// }
// .el-submenu [class^='el-icon-'] {
//     margin-right: 17px;
// }
// .el-submenu__title {
//     font-size: @fontS14;
//     padding-left: 25px;
//     line-height: 42px;
//     height: 42px;
// }
// .el-submenu__icon-arrow {
//     right: 25px;
// }
// .el-submenu {
//     .el-menu {
//         .el-menu-item {
//             color: @c-ccc;
//             &:hover {
//                 color: @primary;
//             }
//         }
//     }
//     &.is-active {
//         .el-menu {
//             .el-menu-item {
//                 // background: #322f2e !important;
//                 &.is-active {
//                     // color: @fff;
//                 }
//                 &:hover {
//                     // color: @primary;
//                 }
//             }
//         }
//     }
//     .el-submenu__title {
//         color: @c-999;
//         // background: #322f2e;
//     }
// }
// .el-submenu .el-menu-item {
//     padding-left: 70px !important;
// }

// 时间选择下拉框
.el-date-editor .el-range-input {
    width: 127px;
}

// 复选框
.el-radio-button__inner {
    border: 1px solid @e8;
    padding: 11px 20px;
    color: @c-666;
}
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
    border-color: @primary;
    background-color: @fff;
    color: @primary;
    box-shadow: none;
}

// 上传
.el-upload--picture-card {
    width: 100px;
    height: 100px;
    vertical-align: middle;
    line-height: 100px;
    background-color: @f8;
    border: 1px solid @e8;
    border-radius: @box-radius;
    &:hover,
    &:focus {
        border-color: @e8;
        color: @c-999;
    }
}
.el-upload-list--picture-card .el-upload-list__item {
    width: 100px;
    height: 100px;
    .el-upload-list__item-preview,
    .el-upload-list__item-delete {
        display: none;
    }
}

// textarea
.el-textarea {
    width: 500px;
    .el-textarea__inner {
        height: 130px;
        color: @c-333;
    }
}
// el-dropdown
.el-dropdown {
    .el-button {
        min-width: 30px;
    }
}

// 下拉多选框
.el-cascader-menus {
    background-color: transparent;
    border: 0;
    box-shadow: none;
    .el-cascader-menu {
        height: 418px;
        width: 200px;
        border: 1px solid @e8;
        padding: 0;
        box-shadow: 0px 2px 8px 0px rgba(34, 24, 21, 0.04);
        border-radius: 2px;
        margin-right: 10px;
        background-color: @fff;
    }
    .el-cascader-menu__item {
        padding: 8px 10px;
        &--extensible:after {
            right: 10px;
        }
    }
}
.el-cascader__label {
    color: @c-333;
    span {
        color: @c-333;
    }
}

// 日期选择
.el-range-editor.el-input__inner {
    padding: 0;
    border: 0;
    .el-range-input {
        font-size: @fontS12;
        color: @c-333;
        border-radius: @box-radius;
        border: 1px solid @e8;
    }
}
.el-range-editor .el-range-separator,
.el-range-separator {
    line-height: 40px;
    color: @e8;
    padding: 0 3px;
    width: 17px;
}
.el-range-editor .el-range__icon {
    display: none;
}


.el-radio__input.is-checked + .el-radio__label{
    color: @c-333;
}
.el-radio__input + .el-radio__label{
    color: @c-999;
    padding-left: 8px;
}

.el-table td,
.el-table th.is-leaf{
    border-bottom: none
}
.el-table--border.el-table td,
.el-table--border.el-table th.is-leaf{
    border-bottom: 1px solid #e8e8e8;
}
//  el-table goodstable el-table--fit el-table--striped el-table--border el-table--enable-row-transition
//  el-table goodstable el-table--fit el-table--striped el-table--enable-row-transition

// 修改下拉框箭头
.el-input__suffix{
    right: 3px;
    .el-input__icon.el-icon-arrow-down:before{
        color: @c-999;
        font-size: 12px;
    }
    .el-input__icon.el-icon-arrow-up:before{
        color: @c-999;
        font-size: 12px;
        line-height: 34px;
    }
}
.el-select .el-input .el-select__caret.is-reverse{
    margin-top: 0;
}
.el-select .el-input .el-select__caret{
        margin-top: 2px;
        transition: 0.2s;
}

.el-popper[x-placement^="bottom"] {
    margin-top: 6px;
}
.el-message-box .el-message-box__btns .el-button {
    background-color: @primary;
    color: @fff;
    border: 1px solid @primary;
}
.el-message-box .el-message-box__btns .el-button--small.el-button--primary {
    background-color: @fff;
    color: @c-333;
    border: 1px solid #DCDFE6;
    &:hover {
        color: @primary;
        border-color: @primary;
    }
}